<style lang="less">
  @import '../../styles/common.less';
</style>
<style scope>
</style>
<template>
    <div>
      <Form ref="classData" :model="classData" :rules="ruleValidate" :label-width="110">
        <div class="ivu-row" style="border-bottom: 1px #ccc solid; margin-bottom: 20px; ">
          <div style="float: left; width: 30%;padding-right: 20px;padding-top: 30px;">
            <FormItem label="班级名称：" prop="className">
              <Input v-model="classData.className" placeholder="请输入班级名称"></Input>
            </FormItem>
            <FormItem label="班主任：" prop="classPerson">
              <Input v-model="classData.classPerson" placeholder="请输入班主任"></Input>
            </FormItem>
            <FormItem label="班级类型：" prop="classType">
              <Input v-model="classData.classType" placeholder="请输入班级类型"></Input>
            </FormItem>
            <FormItem label="备注：">
              <Input v-model="classData.remark" placeholder="请输入内容"></Input>
            </FormItem>
            <FormItem label="附件：" prop="files">
              <Row type="flex" justify="center" align="middle" class="height-100">
                <Upload
                        action="/school/fileUpload/"
                        :on-format-error="handleFormatError" :on-success="handleSuccess" :on-remove="handleRemove">
                  <span>选择文件上传&nbsp;&nbsp;</span>
                  <Button type="ghost" icon="ios-cloud-upload-outline">上传文件</Button>
                </Upload>
              </Row>
            </FormItem>
          </div>
          <div style="float: left; width: 65%; border-left: 1px #ccc solid;padding-top: 30px;">
            <div style=" margin-left: -90px;">
            <FormItem label="">
              <UE :defaultMsg=defaultMsg :config=config :id=ue1 ref="ue"></UE>
          </FormItem>
          </div>
          </div>

        </div>






        <FormItem>
          <Button type="primary" @click="handleSubmit('classData')">提交</Button>
          <Button type="ghost" @click="handleReset('classData')">清空</Button>
        </FormItem>
      </Form>
    </div>
</template>

<script>
  import moment from 'moment'
  import UE from '../ue/ue.vue';
    export default {
      components: {UE},
      name: "classmod",
      data(){
        return{
          classData:{
            className:'',
            classPerson:'',
            classType:'',
            classDesc:'',
            remark:'',
            classFiles:[],
            id:0
          },
          ruleValidate:{
            className:[
              {required: true,message:'请输入名称',trigger:'blur'}
            ],
            classPerson:[
              {required: true,message:'请输入班主任',trigger:'blur'}
            ],
            classType:[
              {required: true,message:'请输入类型',trigger:'blur'}
            ]
          },
          defaultMsg: '',
          config: {
            initialFrameWidth: null,
            initialFrameHeight: 350
          },
          ue1: "ue1", // 不同编辑器必须不同的id
        }
      },
      methods:{
        handleSubmit(name){
          this.$refs[name].validate((valid) => {
            if (valid) {
              var files = this.classData.classFiles.join(',');
              let dataArr = {
                className:this.classData.className,
                classPerson:this.classData.classPerson,
                classType:this.classData.classType,
                classDesc:this.$refs.ue.getUEContent(),
                remark:this.classData.remark,
                classFiles:files,
                id:this.classData.id
              };

              console.log(dataArr);
              if(this.classData.id > 0){
                this.$http.post('/school/updClass', dataArr).then(res => {
                  this.$Message.success('更新成功!');
                  // this.handleReset(name);
                });
              }else {
                this.$http.post('/school/addClass', dataArr).then(res => {
                  this.$Message.success('更新成功!');
                  this.handleReset(name);
                });
              }
            }
          })
        },
        handleReset (name) {
          this.$refs[name].resetFields();
        },
        handleFormatError (file) {
          this.$Notice.warning({
            title: '文件格式不正确',
            desc: '文件 ' + file.name + ' 格式不正确，请选择文件。'
          });
        },
        handleSuccess(response, file, fileList){
          console.log(response);
          this.classData.push(response.data[0]);
        },
        handleRemove(file, fileList){
          this.projectData.file1 = '';
        }
      },
      mounted () {
        console.log(this.$route.query.id);
        if(this.$route.query.id == undefined) return;
        this.$http.get('/school/getClassById?id='+this.$route.query.id).then(res=>{
          console.log(res);
          var dt = res.data.data;
          this.classData.id = dt.id;
          this.classData.className = dt.className;
          this.classData.classPerson = dt.classPerson;
          this.classData.classType = dt.classType;
          this.classData.classDesc = dt.classDesc;
          this.classData.remark = dt.remark;
          this.classData.classFiles = dt.classFiles.split(',');

          this.$refs.ue.setUEContent(dt.classDesc)
        });
      },
      created () {

      }
    }
</script>

<style scoped>
  .ql-container{height: 200px !important;}
</style>
